<template>
    <div class="phoneLogin">
        <TopHeader  centerMsg="Wkcoin 打工人币" />
        <div class="usersImg">
            <img :src="avatar" alt="">
        </div>
        <!-- {{userInfo}} -->
        <formlogin></formlogin>
        <div class="detailedMsg">
            <router-link to="register">注册</router-link>
        </div>
    </div>
</template>

<script>
    import TopHeader from '@/components/TopHeader.vue'
    import formlogin from '@/components/formlogin.vue'
    import {mapState} from 'vuex'
    export default {
        name: "login",
        components: {
            TopHeader,
            formlogin
        },
        data () {
            return {
                avatar:require('@/assets/images/logo.png'),
            }
        },
        computed:{
            ...mapState([
                "userInfo",

            ])
        },
        methods:{
            formVal(data){
            },
            isTruePhone(str){
                let reg = /^1[34578]\d{9}$/;
                if(!reg.test(str)){
                    return false;
                }
                return true;

            }

        }
    }
</script>

<style scoped lang='less'>
    .phoneLogin{
        box-sizing: border-box;
        .usersImg{
            padding-top: 3rem;
            display: flex;
            align-items: flex-end;
            justify-content: center;
            height:10rem;
            margin-bottom: 1.1rem;
            img{
                height: 85px;
                width:85px;
                border-radius: 50%;
            }
        }
    }
</style>

